<template lang='pug'>
  .map-render-warp
    button.btn.btn-compelte(@click.self="isShow = lnglat && lnglat.length > 0") 查看位置
    SmartDialog(v-model="isShow" title="查看位置" size="md")
      LocalMap.map-content(
        v-if="isShow"
        :center="lnglat"
        :mapDatas="mapDatas"
        :columns="columns"
        :infoList="infoList")
</template>

<script>
/**
 * @name 支持地图展示单个坐标点
 * @author linmn
 */
import LocalMap from '@/components/Map'
import SmartDialog from '@/components/SmartDialog'

export default {
  name: 'MapRender',
  components: {
    LocalMap,
    SmartDialog
  },
  props: {
    center: Array,
    lnglat: {
      type: Array,
      default: () => ([])
    }
  },
  computed: {
    mapDatas () {
      if (!this.lnglat || !this.lnglat.length) return []
      return Array.of({
        showMarker: true,
        visible: true,
        draggable: false,
        position: this.lnglat,
        title: this.lnglat.join(',')
      })
    }
  },
  data () {
    return {
      isShow: false,
      /* 信息窗体所需信息 */
      columns: {},
      infoList: []
    }
  },
  methods: {
    showMap () {}
  }
}
</script>

<style lang='sass' scoped>
.map-content
  width: 800px
  height: 500px
</style>
